<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title></title>
	<style type="text/css">
/*		序选择器*/
	/*p:first-child{
		color: red;
		}
		p:last-child{
			color: blue;
		}*/


/*		odd 代表奇数位  */
		/*p:nth-child(odd){
			color: orange;
		}*/

/*		even 代表偶数位*/
		/*p:nth-child(even){
			color: skyblue;
		}*/
/*		n 代表123456..........*/
		/*p:nth-child(3n){
			color: pink;
		}*/

/*		选中同级别同层级的  第二个并且是 p标签*/
		/*p:nth-child(2){
			color: red;
		}*/

/*		选中同级别类型的标签中的第几个*/
		.box p:nth-of-type(2){
			color: pink;
		}




	</style>
	
</head>
<body>
	<p>111</p>
	<p>222</p>

	<div class="box">
		<p>老许的裤衩子</p>
		<div>许哥的黑腿毛</div>
		<h2>3333</h2>
		<p>老许的兰子</p>
		<p>凡人修仙传</p>
		<p>唐朝鬼事录</p>
	</div>

</body>
</html>